import { defineStore } from 'pinia'

// 定义菜单 store
export const useMenuStore = defineStore('menu', {
  // 状态
  state: () => ({
    isCollapse: false,
    // 存储选中的菜单
    selectMenu: [],
    routerList: [],
    //左侧菜单保持高亮
    menuActive: '1-1'
  }),
  
  // 操作方法（相当于 mutations + actions）
  actions: {
    //菜单折叠 展开
    collapseMenu() {
      this.isCollapse = !this.isCollapse
      //Pinia 会自动触发依赖该状态的组件更新
    },
    
    //添加标签页
    addMenu(payload) {
      //新菜单项（payload）
      //对数据进行去重
      //如果没找到，findIndex 返回 -1
      //经过判断去重后，添加到selectMenu 数组
      if (this.selectMenu.findIndex(item => item.path === payload.path) === -1) {
        this.selectMenu.push(payload)
      }
    },
    
    closeMenu(payload) {
      //找到点击数据的索引
      const index = this.selectMenu.findIndex(val => val.name === payload.name)
      //通过索引删除数组指定元素,index开始位置，1为个数
      this.selectMenu.splice(index, 1)
    },
    
    //动态生成路由菜单
    dynamicMenu(payload) {
      //// 通过 import.meta.glob 批量导入 views 目录下的所有 .vue 组件（支持多级目录）
      const modules = import.meta.glob('../views/**/**/*.vue')
      // // 递归处理路由数据，为每个路由绑定对应的组件
      function routerSet(router) {
        router.forEach(route => {
          // 如果当前路由没有子菜单，则绑定组件
          if (!route.children) {
            //// 拼接组件路径
            const url = `../views${route.meta.path}/index.vue`
            // 从导入的 modules 中获取对应的组件，赋值给 route.component
            route.component = modules[url]
          } else {
            // 如果有子菜单，递归处理子路由
            routerSet(route.children)
          }
        })
      }
      //调用递归函数处理传入的路由数据（payload）
      routerSet(payload)
      //拿到完整的路由数据
      this.routerList = payload
    },
    
    //左侧保持高亮
    updateMenuActive(payload) {
      this.menuActive = payload
    },
    
    // 根据路径计算菜单激活状态
    updateMenuActiveByPath(path) {
      // 递归查找匹配的菜单项
      const findMenuByPath = (menuList, parentIndex = '1') => {
        for (let i = 0; i < menuList.length; i++) {
          const menu = menuList[i]
          const currentIndex = `${parentIndex}-${menu.meta.id}`
          
          // 如果当前菜单项的路径匹配
          if (menu.meta.path === path) {
            return currentIndex
          }
          
          // 如果有子菜单，递归查找
          if (menu.children && menu.children.length > 0) {
            const found = findMenuByPath(menu.children, currentIndex)
            if (found) {
              return found
            }
          }
        }
        return null
      }
      
      const activeIndex = findMenuByPath(this.routerList)
      if (activeIndex) {
        this.menuActive = activeIndex
      }
    }
  },
  
  // 持久化配置
  persist: {
    key: 'pz_v3pz',
    storage: localStorage
  }
})
